<template>
	<view>
		<view class="address-item" v-for="(item,index) in list" :key="index">
			<view class="address-item-top" @click="selectAddress">
				<view class="address-item-top-left">
					<view class="userinfo"><text>{{item.name}}</text><text>{{item.phone}}</text></view>
					<text class="address-detail" v-if="item.address_type == 1">{{item.province}} {{item.city}}
						{{item.area}} {{item.street}} {{item.address}}</text>
					<text class="address-detail" v-else>{{item.address_type == 2?'港澳台':'海外'}} {{item.address}}</text>
				</view>
				<label class="radio" v-if="type==='picker'">
					<radio color="#ff6600" :checked="isSelect" />
				</label>
			</view>
			<view class="action-wrap" v-if="type ==='manage'">
				<label class="radio" style="font-size: 28rpx; display: flex;align-items: center;">
					<radio color="#ff6600" :checked="item.type ==1?true:false"
						@click.stop="toggleDefaultChecked(item.id,item.type)" />
					<text :style="{color:item.type == 1 ? '#333333' : '#999999' }">设为默认</text>
				</label>
				<view class="btns-wrap">
					<view @click="editClick(item.id)" class="address-btn">编辑</view>
					<view @click.stop="delClick(item.id)" class="address-btn">删除</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			type: {
				type: String,
				default: 'manage'
			},
			list: {
				type: Array,
				default: () => []
			}
		},
		data() {
			return {
				debounceTimer: null
			}
		},
		mounted() {
			this.setDefaultAddressIfOnlyOne();
		},
		methods: {
			toggleDefaultChecked(id, type) {
				if (this.debounceTimer) {
					clearTimeout(this.debounceTimer);
				}
				this.debounceTimer = setTimeout(() => {
					this.list.forEach(item => {
						this.$set(item, 'type', 0); // 将所有地址设置为非默认
					});
					const currentAddress = this.list.find(item => item.id === id);
					if (currentAddress) {
						this.$set(currentAddress, 'type', 1); // 设置当前点击的地址为默认地址
					}
					// 发送网络请求更新默认地址
					this.$api.getSZaddress({
						id: id
					}).then(res => {
						if (res.code !== 1) {
							uni.$u.toast('设置失败，请重试');
						}
					}).catch(err => {
						console.error('设置默认地址失败:', err);
						uni.$u.toast('设置失败，请重试');
					});
				}, 120); // 延迟 120 毫秒执行
			},
			editClick(id) {
				uni.navigateTo({
					url: '/pages/content/addUpdate/addUpdate?id=' + id
				});
			},
			delClick(id) {
				uni.showModal({
					content: '确认是否删除该地址',
					complete: (res) => {
						if (res.confirm) {
							this.$api.getDeleteAddress({
									id: id
								})
								.then(res => {
									if (res.code == 1) {
										uni.$u.toast('删除成功');
										this.setDefaultAddressIfOnlyOne();
										uni.$emit('triggerGetPerson');
									}
								})
								.catch(err => {
									console.error('删除地址失败:', err);
									uni.$u.toast('删除失败，请重试');
								});
						}
					}
				});
			},
			selectAddress(item) {
				if (this.type === 'manage') {
					return;
				}
				this.isSelect = item.id;
				this.$emit('select', this.isSelect ? item : null);
			},
			setDefaultAddressIfOnlyOne() {
				// 如果列表中只有一个地址，则自动将其设置为默认地址
				if (this.list.length === 1) {
					const onlyAddress = this.list[0];
					this.$set(onlyAddress, 'type', 1); // 设置为默认地址
					this.$api.getSZaddress({
						id: onlyAddress.id
					}).then(res => {
						if (res.code !== 1) {
							// 如果设置失败，可以给出提示或回滚状态
							uni.$u.toast('设置默认地址失败，请重试');
						}
					}).catch(err => {
						console.error('设置默认地址失败:', err);
						uni.$u.toast('设置默认地址失败，请重试');
					});
				}
			},
		}
	}
</script>


<style lang="scss" scoped>
	.address-item {
		width: 100%;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		padding: 24rpx 22rpx;
		border-radius: 8rpx;
		background-color: white;
		margin-bottom: 30rpx;
	}

	.address-item-top {
		display: flex;
		align-items: center;

		.address-item-top-left {
			flex: 1;
		}
	}

	.userinfo {
		display: flex;
		align-items: center;
		font-size: 32rpx;
		font-weight: 500;
		color: #111111;

		text:nth-of-type(1) {
			margin-right: 20rpx;
			max-width: 200rpx;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
	}

	.address-detail {
		font-size: 28rpx;
		line-height: 40rpx;
		word-break: break-all;
		margin: 16rpx 0 24rpx 0;
		color: #787878;
		display: -webkit-box;
		/* 设置为WebKit内核的弹性盒子模型 */
		-webkit-box-orient: vertical;
		/* 垂直排列 */
		-webkit-line-clamp: 2;
		/* 限制显示两行 */
		overflow: hidden;
		/* 隐藏超出范围的内容 */
		text-overflow: ellipsis;
		/* 使用省略号 */


	}

	.action-wrap {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-top: 22rpx;
		border-top: 1px solid #eee;

		.btns-wrap {
			display: flex;
			align-items: center;
		}

		.address-btn {
			padding: 4rpx 24rpx;
			border-radius: 40rpx;
			overflow: hidden;
			border: 2rpx solid #ff6600;
			background-color: #ff6600;
			color: #fff;
			font-size: 28rpx;

			&:nth-of-type(2) {
				margin-left: 24rpx;
				color: #F5222D;
				border-color: #F5222D;
				background-color: #fff;
			}
		}
	}
</style>